import { useCallback, useMemo } from "react";
import { useUrlQueryParam } from "utils/url";

// 项目列表搜索的参数
export const useProjectsSearchParams = () => {
  const [param, setParam] = useUrlQueryParam(["name", "personId"]);
  return [
    useMemo(
      () => ({ ...param, personId: Number(param.personId) || undefined }),
      [param]
    ),
    setParam,
  ] as const;
};

export const useProjectModal = () => {
  const [{ projectCreate }, setProjectCreate] = useUrlQueryParam([
    "projectCreate",
  ]);
  const open = useCallback(() => setProjectCreate({ projectCreate: true }), [
    setProjectCreate,
  ]);
  const close = useCallback(
    () => setProjectCreate({ projectCreate: undefined }),
    [setProjectCreate]
  );
  return {
    projectCreate: projectCreate === "true",
    open,
    close,
  };
  // return [
  //   projectCreate === 'true',
  //   open,
  //   close
  // ] as const
  // 返回tuple是为了使用时可以任意命名,有顺序性
  // const [aa,bb,cc] = useProjectModal()
  // 返回元素较多时，可以返回一个对象{}
  // return {
  //   projectCreate === 'true',
  //   open,
  //   close
  // }
  // const{projectCreate:aa,open:bb,close:cc} = useProjectModal()
};
